<template>
  <a-modal :open="open" width="1200px" title="手术预约" centered :footer="false" @cancel="onCancel" @ok="onOk">
    <div class="flex">
      <LabelValue :width="200" label="麻醉医生" :value="formState.anaesDoctorName" />
      <LabelValue :width="200" label="麻醉方式" :value="formState.anaesName" />
      <LabelValue :width="200" label="麻醉前用药" :value="formState.anaesPreDrug" />
      <LabelValue :width="300" label="手术麻醉总时间" :value="(formState.anaesHour || '-') + '小时' + (formState.anaesMinute || '-') + '分钟'" />
      <LabelValue :width="200" label="手术种类" :value="formState.oprType" />
    </div>
    <div class="flex mt-3">
      <LabelValue :width="200" label="麻醉药及用量" :value="formState.anaesDrug" />
      <LabelValue :width="200" label="联合手术1" :value="formState.jointOprName1" />
      <LabelValue :width="200" label="联合手术2" :value="formState.jointOprName2" />
    </div>
    <div class="flex mt-3">
      <div class="w-[70px]">麻醉过程</div>
      <div class="flex-1 w-[500px]">
        <BaseTable column-code="000112" max-fill :heigth="200" :data-source="formState.oprMrecordAnaesList" bordered :pagination="false" :loading="loading" />
      </div>
    </div>
    <div class="flex mt-3">
      <div class="w-[70px]">手术记录</div>
      <div class="h-[100px] truncate">
        {{ formState.oprRecord || '-' }}
      </div>
    </div>
    <div class="flex mt-3">
      <LabelValue :width="200" label="术后诊断" :value="formState.oprIcd10Name" />
    </div>
    <div class="flex mt-3">
      <LabelValue :width="200" label="手术日期" :value="formState.oprDate" />
      <LabelValue :width="200" label="手术时间" :value="formState.oprTime" />
      <LabelValue :width="200" label="手术医生" :value="formState.oprDoctorName" />
      <LabelValue :width="200" label="一助" :value="formState.fNurseName" />
      <LabelValue :width="200" label="二助" :value="formState.sNurseName" />
    </div>
    <div class="flex mt-3">
      <LabelValue :width="200" label="巡回护士" :value="formState.tourNurseName" />
      <LabelValue :width="200" label="器械护士" :value="formState.instrumenttNurseName" />
      <LabelValue :width="200" label="特殊要求" :value="formState.specRequirements" />
    </div>
  </a-modal>
</template>
<script setup>
import { ref, watch } from 'vue'
import { message } from 'ant-design-vue'
import { post } from '@/utils/request'
import LabelValue from '@/components/LabelValue'

const props = defineProps({
  open: Boolean,
  rowData: {
    type: Object,
    default: () => ({})
  }
})
const formState = ref({})
const emit = defineEmits(['update:open'])

const getOperationInfo = async () => {
  const { code, data, msg } = await post('/oprOperation/opr/getOperationMRecordInfo', {
    oprLsh: props.rowData.oprLsh
  })
  if (code !== 0) return message.error(msg)
  formState.value = data
}

const onCancel = () => {
  emit('update:open', false)
}

watch(
  () => props.open,
  (val) => {
    if (val) {
      getOperationInfo()
    }
  }
)
</script>
<style lang="less" scoped></style>
